﻿@using Data.Video
@using Common.Utily
@model List<Video>
<div id="watch7-sidebar" class="watch-sidebar">
    <div id="watch7-sidebar-playlist">
    </div>


    <div id="watch7-sidebar-contents" class="watch-sidebar-gutter   yt-card yt-card-has-padding    yt-uix-expander yt-uix-expander-collapsed">
        <div id="watch7-sidebar-offer">
        </div>

        <div id="watch7-sidebar-ads">
        </div>

        <div id="watch7-sidebar-modules">
            <div class="watch-sidebar-section">
                <h4 class="watch-sidebar-head">Tiếp theo trong Giai điệu Tự hào tháng 9 - Bài ca hy vọng
                </h4>
                <div class="watch-sidebar-body">
                    <ul class="video-list">
                        <li class="video-list-item related-list-item"><a href="/watch?v=WeEQGyypE74" class=" related-video spf-link  yt-uix-sessionlink" ><span class="yt-uix-simple-thumb-wrap yt-uix-simple-thumb-related" data-vid="WeEQGyypE74">
                            <img aria-hidden="true" data-thumb="//i.ytimg.com/vi/WeEQGyypE74/default.jpg" alt="" src="//i.ytimg.com/vi/lcxblGyIv90/default.jpg" width="120" height="90"><span class="video-time">4:57</span>  <span class="thumb-menu dark-overflow-action-menu video-actions">
                                <button type="button" class="yt-uix-button-reverse flip addto-watch-queue-menu spf-nolink hide-until-delayloaded yt-uix-button yt-uix-button-dark-overflow-action-menu yt-uix-button-size-default yt-uix-button-has-icon yt-uix-button-empty" onclick=";return false;" role="button" aria-pressed="false" aria-expanded="false" aria-haspopup="true" aria-activedescendant="">
                                    <span class="yt-uix-button-icon-wrapper">
                                        <img src="//i.ytimg.com/vi/lcxblGyIv90/default.jpg" alt="" class="yt-uix-button-icon yt-uix-button-icon-dark-overflow-action-menu yt-sprite"></span><img src="//i.ytimg.com/vi/lcxblGyIv90/default.jpg" alt="" class="yt-uix-button-arrow yt-sprite"><ul class="watch-queue-thumb-menu yt-uix-button-menu yt-uix-button-menu-dark-overflow-action-menu" style="display: none;">
                                            <li role="menuitem">
                                                <span class="overflow-menu-choice addto-watch-queue-menu-choice yt-uix-button-menu-item" data-action="play-next" onclick=";return false;" >
                                                    <span class="yt-uix-button-icon-wrapper">
                                                        <img src="//i.ytimg.com/vi/lcxblGyIv90/default.jpg" alt="" class="addto-watch-queue-play-next-icon yt-valign-container yt-sprite">
                                                    </span>
                                                    Phát video tiếp theo
                                                </span>
                                            </li>
                                            <li role="menuitem">
                                                <span class="overflow-menu-choice addto-watch-queue-menu-choice yt-uix-button-menu-item" data-action="play-now" onclick=";return false;" data-video-ids="WeEQGyypE74">
                                                    <span class="yt-uix-button-icon-wrapper">
                                                        <img src="//i.ytimg.com/vi/lcxblGyIv90/default.jpg" alt="" class="addto-watch-queue-play-now-icon yt-valign-container yt-sprite">
                                                    </span>
                                                    Phát ngay bây giờ
                                                </span>
                                            </li>
                                        </ul>
                                </button>
                            </span>


                            <button class="yt-uix-button yt-uix-button-size-small yt-uix-button-default yt-uix-button-empty yt-uix-button-has-icon addto-button video-actions spf-nolink hide-until-delayloaded addto-watch-later-button-sign-in yt-uix-tooltip" type="button" onclick=";return false;" role="button" title="Xem sau" data-button-menu-id="shared-addto-watch-later-login" data-video-ids="WeEQGyypE74">
                                <span class="yt-uix-button-icon-wrapper">
                                    <img src="//i.ytimg.com/vi/lcxblGyIv90/default.jpg" alt="" class="yt-uix-button-icon yt-uix-button-icon-addto yt-sprite" title="Xem sau"></span><img src="//i.ytimg.com/vi/lcxblGyIv90/default.jpg" alt="" class="yt-uix-button-arrow yt-sprite"></button>
                            <button class="yt-uix-button yt-uix-button-size-small yt-uix-button-default yt-uix-button-empty yt-uix-button-has-icon addto-button addto-queue-button video-actions spf-nolink hide-until-delayloaded addto-tv-queue-button yt-uix-tooltip" type="button" onclick=";return false;" title="Hàng đợi TV" data-video-ids="WeEQGyypE74" data-style="tv-queue">
                                <span class="yt-uix-button-icon-wrapper">
                                    <img src="//i.ytimg.com/vi/lcxblGyIv90/default.jpg" alt="" class="yt-uix-button-icon yt-uix-button-icon-addto yt-sprite" title="Hàng đợi TV"></span></button>
                        </span><span dir="ltr" class="title" title="Đồng hành cùng Giai điệu Tự hào số 70 - Người chắp cánh cho Bài ca hy vọng">Đồng hành cùng Giai điệu Tự hào số 70 - Người chắp cánh cho Bài ca hy vọng
                        </span>
                            <span class="stat attribution">
                                <span class="g-hovercard"
                                    data-ytid="UCj-vrgC8AJo9NTHEvM6LWmg"
                                    data-name="episodic">bởi <span class=" g-hovercard" data-ytid="UCj-vrgC8AJo9NTHEvM6LWmg">Giai Điệu Tự Hào</span>
                                </span>
                            </span>
                            <span class="stat view-count">1.156 lượt xem</span>
                        </a>
                        </li>
                    </ul>
                </div>

                <div class="watch-sidebar-foot">
                    <a href="/watch?v=tRdVGx4EKZk&amp;list=PLQLjsHAVzlxGCM2ky79oYb7VLC1nsVkZG" class=" resumable-list yt-uix-sessionlink     spf-link " >Phát tất cả</a>
                </div>
            </div>

            <div class="watch-sidebar-section">
                <h4 class="watch-sidebar-head">Đề xuất
                </h4>
                <div class="watch-sidebar-body">
                    <ul id="watch-related" class="video-list">
                        @foreach (var item in Model)
                        {
                            <li class="video-list-item related-list-item"><a href="/watch?v=@item.YCode" class=" related-video spf-link  yt-uix-sessionlink"  ><span class="yt-uix-simple-thumb-wrap yt-uix-simple-thumb-related"  >
                                <img aria-hidden="true"  alt="" src="//i.ytimg.com/vi/@item.YCode/default.jpg" width="120" height="90"><span class="video-time">1:20:48</span> 
                                
                            </span><span dir="ltr" class="title" title="@item.Title">@item.Title
                            </span>
                                <span class="stat attribution">
                                    <span class="g-hovercard"  >bởi <span class=" g-hovercard"  >Clips Fanmade</span>
                                    </span>
                                </span>
                                <span class="stat view-count">@StringUtils.FormatNumber(item.View) lượt xem</span>
                            </a>
                            </li> 
                            
                            
                        }
                    </ul>
                </div>
            </div>

        </div>
    </div>

</div>
